<%-- 
  -- Body New para User.
  --
  -- @author nicolas.gonzalez
--%>
<%@ taglib uri="/WEB-INF/struts-html.tld" prefix="html" %>
<%@ taglib uri="/WEB-INF/struts-logic.tld" prefix="logic" %>
<%@ taglib uri="/WEB-INF/struts-bean.tld" prefix="bean" %>
<%@ taglib uri="/WEB-INF/struts-tiles.tld" prefix="tiles" %>
<%@ taglib uri="/WEB-INF/struts-html-el-1.2.8.tld" prefix="html-el"%>
<%@ taglib uri="/WEB-INF/struts-logic-el-1.2.8.tld" prefix="logic-el"%>
<%@ taglib uri="/WEB-INF/security.tld" prefix="security" %>

<%@ taglib uri="http://struts.apache.org/tags-bean-el" prefix="bean2"%>

<div class="errors">
    <html:errors />
</div>

<script src="<html:rewrite page='/protected/script/util.js'/>" type="text/javascript"></script>

<%-- Para EXT --%>
<link rel="stylesheet" type="text/css" href="<html:rewrite page='/protected/script/ext-1.1.1/resources/css/ext-all.css'/>" />

<script src="<html:rewrite page='/protected/script/ext-1.1.1/adapter/ext/ext-base.js'/>" type="text/javascript"></script>
<script src="<html:rewrite page='/protected/script/ext-1.1.1/ext-all.js'/>" type="text/javascript"></script>

<link rel="stylesheet" type="text/css" href="<html:rewrite page='/protected/style/dragdrop.css'/>" id="styleFile"/>

<%-- prototype esta en el main layout --%>
<script src="<html:rewrite page='/protected/script/scriptaculous/scriptaculous.js'/>" type="text/javascript"></script>

<script type="text/javascript">
    /** Crea un usuario */
    function createUser() {
        // Validaciones basicas
        if (Util.valid.isBlank($("nameId").value)) {
            Ext.MessageBox.alert('Error', 'Debe ingresar nombre de usuario. ');
            return;
        }        
        if (Util.valid.isBlank($("passwordId").value)) {
            Ext.MessageBox.alert('Error', 'Debe ingresar password. ');
            return;
        }        
        if (Util.valid.isBlank($("passwordConfirmationId").value)) {
            Ext.MessageBox.alert('Error', 'Debe ingresar confirmacion de password. ');
            return;
        }        
        if ($("passwordId").value != $("passwordConfirmationId").value) {
            Ext.MessageBox.alert('Error', 'Passwords no coinciden. ');
            return;
        }
        if (Util.valid.isBlank($("realNameId").value)) {
            Ext.MessageBox.alert('Error', 'Debe ingresar el nombre completo del usuario. ');
            return;
        }        
        if (Util.valid.isBlank($("surnameId").value)) {
            Ext.MessageBox.alert('Error', 'Debe ingresar el apellido del usuario. ');
            return;
        }        
        
        var ul = $('actualRoles');
        var lisCollection = ul.getElementsByTagName('li');
        var chosen = "";
        for (var i = 0; i < lisCollection.length; i++) {
            var elem = lisCollection[i];
            
            chosen += elem.id;
            if (i != (lisCollection.length - 1)) {
                // Para evitar ponerlo en el ultimo...
                chosen += ";";
            }
        }    
        
        var chosenObj = $("createChosenRolesId");
        var nameObj = $("createNameId");
        var passwordObj = $("createPasswordId");
        var passwordObj = $("createPasswordId");
        var passwordConfirmationObj = $("createPasswordConfirmationId");
        
        chosenObj.value = chosen;
        nameObj.value = $("nameId").value;
        passwordObj.value = $("passwordId").value;
        passwordConfirmationObj.value = $("passwordConfirmationId").value;
        $("createRealNameId").value = $("realNameId").value;
        $("createSurnameId").value = $("surnameId").value;;
        
        var form = $("createUserFormId");
        form.submit();
    } 
</script>

<%-- El ID del form NO debe ser modificado. Se usa desde el menu --%>
<html:form action="/protected/showNewUser" styleId="userFormId">

    <h2>Creaci&oacute;n de usuario</h2>
    
    <div class="userEdit">
        <table class="tableData" cellspacing="0">
            <tr>
                <td class="tableDataTitle">
                    Usuario*
                </td>
                <td class="tableDataValue">
                    <html:text property="name" styleId="nameId" />
                </td>            
            </tr>
            <tr>
                <td class="tableDataTitle">
                    Nombre*
                </td>
                <td class="tableDataValue">
                    <html:text property="realName" styleId="realNameId" />
                </td>            
            </tr>
            <tr>
                <td class="tableDataTitle">
                    Apellido*
                </td>
                <td class="tableDataValue">
                    <html:text property="surname" styleId="surnameId" />
                </td>            
            </tr>
            <tr>
                <td class="tableDataTitle">
                    Password*
                </td>
                <td class="tableDataValue">
                    <html:password property="password" styleId="passwordId" value="" />
                </td>            
            </tr>
            <tr>
                <td class="tableDataTitle">
                    Confirmar*
                </td>
                <td class="tableDataValue">
                    <html:password property="passwordConfirmation" styleId="passwordConfirmationId" value="" />
                </td>            
            </tr>
        </table>
    
        <div id="clear">
        </div>
        
        <bean:define id="actualRoles" name="userForm" property="actualRoles" />
        <bean:define id="availableRoles" name="userForm" property="availableRoles" />

		<br/>
		<h2>Roles</h2>
        <div class="panelBody">
            <h3 class="panelTitle">Roles Actuales</h3>

            <ul style="position: relative; font-weight: bold;" class="sortableList boxy_fw scrollable" id="actualRoles">
                <logic-el:iterate id="role" name="actualRoles">
                    <li id='<bean:write name="role" property="name"/>' title='<bean:write name="role" property="description"/>' style="position: relative;" class="listElement">           
                        <bean:write name="role" property="name"/>
                    </li>
                </logic-el:iterate>
            </ul>
        </div>        

        <div class="panelBody">
            <h3 class="panelTitle">Roles Disponibles</h3>

            <ul style="position: relative;" class="sortableList boxy_fw scrollable" id="availableRoles">
                <logic-el:iterate id="role" name="availableRoles">
                    <li id='<bean:write name="role" property="name"/>' title='<bean:write name="role" property="description"/>' style="position: relative;" class="listElement">           
                        <bean:write name="role" property="name"/>
                    </li>
                </logic-el:iterate>
            </ul>
        </div>        

        <%-- No se valida seguridad ya que SOLO entran aca los administradores --%>
        <script type="text/javascript">
            Sortable.create("actualRoles",{dropOnEmpty:true,containment:["actualRoles","availableRoles"],constraint:false});
            Sortable.create("availableRoles",{dropOnEmpty:true,handle:'handle',containment:["actualRoles","availableRoles"],constraint:false});
        </script>

        
        <div id="clear">
        </div>
       	<p class="mensajeCamposObligatorios">Los campos marcados con un asterisco (*) son obligatorios.</p>
        <div id="clear">
        </div>
        
        <%-- No se valida seguridad ya que SOLO entran aca los administradores --%>
        <div class="panelButton">
            <input type="button" value="Guardar" onclick="createUser();" title="Guarda el usuario..." class="button">
        </div>  
    
    </div>

</html:form>

<%-- Inyectados por Javascript --%>
<div id="createDivId" class="hideClass">
    <html:form action="/protected/createUser" styleId="createUserFormId">
        <html:hidden property="name" value="" styleId="createNameId" />
        <html:hidden property="password" value="" styleId="createPasswordId" />
        <html:hidden property="passwordConfirmation" value="" styleId="createPasswordConfirmationId" />
        <html:hidden property="chosenRoles" value="" styleId="createChosenRolesId" />
        <html:hidden property="realName" value="" styleId="createRealNameId" />
        <html:hidden property="surname" value="" styleId="createSurnameId" />
    </html:form>
</div>